import { onKeyStroke, useMagicKeys, whenever } from '@vueuse/core'
import useHistoryUtil from './useHistoryUtil'
import { IToolConfig, IToolType } from '../types'
import { Reactive } from 'vue'
export const useHotKeyUtil = (config: {
	activeTool: Ref<string>
	setActiveTool: (tool: IToolType | '') => void
	historyUtil: ReturnType<typeof useHistoryUtil>
	hanScale: (isAdd: boolean) => void
	toolConfig: Reactive<IToolConfig>
}) => {
	const { activeTool, historyUtil, hanScale, setActiveTool, toolConfig } =
		config
	const keys = useMagicKeys()
	const changeTool = (tool: IToolType | '') => {
		if (activeTool.value === tool) return
		setActiveTool(tool)
	}
	whenever(keys['P'], () => {
		changeTool('pen')
	})
	whenever(keys['T'], () => {
		changeTool('text')
	})
	whenever(keys['E'], () => {
		changeTool('eraser')
	})
	whenever(keys['Ctrl+Z'], () => {
		historyUtil.undo()
	})
	whenever(keys['O'], () => {
		toolConfig.shape.type = 'circle'
		changeTool('shape')
	})
	whenever(keys['R'], () => {
		toolConfig.shape.type = 'square'
		changeTool('shape')
	})
	onKeyStroke(['+', '='], (e) => {
		if (!e.ctrlKey) return
		e.preventDefault()
		hanScale(true)
	})
	onKeyStroke(['-'], (e) => {
		if (!e.ctrlKey) return
		e.preventDefault()
		hanScale(false)
	})
}
